<template>
	<view class="container">
		<navbar title="代理招募" :toBack="false"></navbar>
		<loading-page :show="isLoading"></loading-page>
		<view class="main" v-if="!isLoading" :style="{paddingTop: navbarHeight  + 'px'}">
			<u-image v-if="agent_apply == 0" :src="$getImageUrl('/user_client/image/agents-base.jpg')" width="750rpx"
				height="1300rpx"></u-image>
			<u-image v-if="agent_apply == 1" :src="$getImageUrl('/user_client/image/agent-base1.jpg')" width="750rpx"
				height="1300rpx"></u-image>
			<u-image v-if="agent_apply == 2" :src="$getImageUrl('/user_client/image/agent-base2.jpg')" width="750rpx"
				height="1300rpx"></u-image>
			<u-image v-if="agent_apply == 3" :src="$getImageUrl('/user_client/image/agent-base3.jpg')" width="750rpx"
				height="1300rpx"></u-image>
			<view class="click-left" @click="jump(10)" :style="{top:(navbarHeight + 162.5) + 'px'}"></view>
			<view class="click-right" @click="jump(20)" :style="{top:(navbarHeight + 162.5) + 'px'}"></view>
		</view>
		<customer-service-suspension></customer-service-suspension>
		<tabbar></tabbar>
	</view>
</template>

<script>
	import {
		mapState
	} from 'vuex'
	export default {
		data() {
			return {
				isLoading: true,
				type: 10
			}
		},
		onLoad(e) {
			if (e.parent_id) {
				uni.setStorageSync('parent_id', e.parent_id)
			}
			setTimeout(() => {
				this.isLoading = false
			}, 1000)
		},
		onShow() {
			// app隐藏tabbar需要在页面中进行
			uni.hideTabBar({
				success: () => {},
				fail: (ex) => {
					console.log(ex)
					// 捕获报错，防止没有tabbar页面调用后控制台报错
				}
			});
		},
		computed: {
			...mapState({
				agent_apply: state => state.init.agent_apply,
				navbarHeight: (state) => state.init.navbarHeight,
				userInfo: (state) => state.user.userInfo,
			})
		},
		methods: {
			jump(type) {
				this.type = type
				let navigateToResult = (this.agent_apply === 1 && this.type === 10) || (this.agent_apply === 2 && this
					.type === 20) || (this.agent_apply > 2);
				if (navigateToResult) {
					this.$navigateTo('/subPackages/agent-application/result?type=' + this.type);
				} else {
					this.$navigateTo('/subPackages/agent-application/index?type=' + this.type);
				}
			}
		},
		onShareAppMessage() {
			const id = this.userInfo.id || ''
			return {
				path: `/pages/agent/index?parent_id=${id}`
			};
		},
		// 分享到朋友圈
		onShareTimeline: function(res) {
			return this.$onShareTimeline()
		},
	}
</script>

<style lang="scss" scoped>
	.container {
		.main {
			padding-bottom: 140rpx;
			position: relative;

			.click-left {
				position: absolute;
				top: 0;
				left: 20rpx;
				width: 330rpx;
				height: 600rpx;
				background-color: transparent;
			}

			.click-right {
				position: absolute;
				top: 0;
				right: 20rpx;
				width: 330rpx;
				height: 600rpx;
				background-color: transparent;
			}
		}
	}
</style>